<template>
	<view class="page">
		<view class="title">
			小微链
		</view>
		<!-- 手动测试开始 -->
		<view v-if="debugType == 'true'">
		<view class="tab-box" >
			<view class="tab-item" v-for="(item,index) in navList" @click="navChange(index)" :class="{'selected' : navselected == index}" :key="index">
				{{item.name}}
			</view>
		</view>
		<login v-if="navselected == 0" :loginType="loginType" @typeChange="loginTypeChange"></login>
		<register v-if="navselected == 1" @confirm="registerConfirm"></register>
		</view>
		<!-- 手动测试结束 -->
		<view class="login-button" @click="login" v-if="debugType == 'false'">
			一键授权登录
		</view>
		<bindmobile v-if="bindFlag" @close="closeBind"></bindmobile>
	</view>
</template>

<script>
	import login from '../component/login/login.vue';
	import register from '../component/register/register.vue'
	import * as api from '@/utils/api.js';
	import bindmobile from '@/components/bindmobile/index';
	export default {
		components: {
			bindmobile,
			login,
			register,
		},
		data() {
			return {
				debugType:"false",// 调试模式开启状态
				bindFlag: false,
				navList: [{
						name: '登录'
					},
					{
						name: '注册'
					},
				],
				loginType: 'account',
				navselected: 0,
			}
		},
		onLoad() {
			let debugType = getApp().globalData.debugType;
			if(debugType == "true"){
				this.debugType = "true";
			}
			// uni.navigateTo({
			// url: '/pages/web/web?type=0'
			// });
		},
		methods: {
			/***  关闭绑定手机弹框 */
			closeBind(){
				this.bindFlag = false
			},
			/** 授权登录  */
			login() {
				let that = this;
				uni.getProvider({
					service: 'oauth',
					success: function(res) {
						// console.log('获取服务商', res)
						if (~res.provider.indexOf('weixin')) {
							console.log(111);
							wx.qy.login({
								success: function(res) {
									api.getUserInfo({
										code: res.code
									}).then(result => {
										console.log('wxuser', result);
										if (result.code == 0) {
											uni.setStorageSync('token', result.data.result
												.token)
											api.user({}).then(res => {
												console.log('user', res.data);
												getApp().globalData.userInfo = res
													.data;

											});
											uni.switchTab({
												url: '/pages/index/index'
											});
										}
									}).catch(err => {
										uni.setStorageSync('wxUser', err.data.result)
										that.bindFlag = true
									})
									console.log('企业微信', res);
								},
								fail: function(err) {
									console.log(err);
								}
							});

						}
					}
				});

			},
			/**
			 * 导航改变触发事件
			 */
			navChange: function(index) {
				this.navselected = index;
			},
			/**
			 * 登录方式改变触发事件
			 */
			loginTypeChange: function(e) {
				let loginType = this.loginType;
				if (loginType == 'account') {
					5

					this.loginType = 'code';
				} else if (loginType == 'code') {
					this.loginType = 'account';
				}
			},
			registerConfirm: function() {
				this.navselected = 0;
			},
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		width: 100%;
		height: 100vh;
		overflow: hidden;
		background-image: url(../../../static/image/loginBg.png);
		background-size: 100% 100%;
		background-repeat: no-repeat;

		.title {
			margin-top: 15vh;
			font-size: 60rpx;
			color: white;
			text-align: center;
		}

		.tab-box {
			display: flex;
			width: 70%;
			margin: 0 15%;
			margin-top: 50rpx;
			line-height: 70rpx;
			border-radius: 70rpx;
			background-color: rgba(255, 255, 255, 0.2);
			justify-content: space-between;

			.tab-item {
				width: 50%;
				color: white;
				text-align: center;
				font-size: 30rpx;
			}

			.selected {
				background-color: #3773f7;
				border-radius: 50rpx;
			}
		}


	}

	.login-button {
		position: absolute;
		width: 70%;
		line-height: 100rpx;
		text-align: center;
		background-color: #4269e2;
		color: white;
		border-radius: 50rpx;
		left: 15%;
		bottom: 50%;
	}
</style>
